
@import "@/modules/block_blogs.scss"; 
@import "@/modules/block_brands_list.scss"; 
@import "@/modules/block_categories_list.scss"; 
@import "@/modules/block_collection_list.scss"; 
@import "@/modules/block_collection_slides.scss"; 
@import "@/modules/block_collection_waterfall.scss"; 
@import "@/modules/block_image.scss"; 
@import "@/modules/block_image_text.scss"; 
@import "@/modules/block_information_bar.scss"; 
@import "@/modules/block_multicolumn_list.scss"; 
@import "@/modules/block_newsletter.scss"; 
@import "@/modules/block_slides.scss"; 
@import "@/modules/block_testimonials.scss"; 
@import "@/modules/footer.scss"; 
@import "@/modules/header.scss"; 

/** template style start **/

.general_title-color {
    color: var(--title_color);
    font-size: var(--title_font_size);
    font-family: var(--title_font_family);
    font-style: var(--title_font_style);
    font-weight: var(--title_font_weigth);
    letter-spacing: var(--title_letter_spacing);
}
@media screen and (max-width: 767px) {
    .general_title-color {
        font-size: calc(var(--title_font_size) * var(--wap_title_scale));
    }
}


.body-scroll-none {
    overflow: hidden;
    height: 100vh;
    width: 100vw;
}

#MainContent > div[data-section-type="block_information_bar"] {
    margin-bottom: 0;
}

#MainContent > div[data-section-type="block_newsletter"] {
    margin-bottom: 0;
}

/** template style start **/
/** animation_btn style start **/
.animation_btn {
    margin-top: 20px;
}
.animation_btn a {
    text-transform: uppercase;
    box-sizing: border-box;
    padding: 0 15px;
    display: inline-flex;
    font-size: inherit;
    align-items: center;
    justify-content: center;
    height: 40px;
    transition: all 0.25s;
    border-radius: var(--button_border_radius);
}
.animation_btn a span {
    display: inline-block;
    margin-right: 8px;
    transition: all 0.25s;
    transform: translateX(12px);
}
.animation_btn a svg {
    width: 17px;
    visibility: hidden;
    opacity: 0;
    transition: all 0.25s;
}
.animation_btn a svg {
    transform: translateX(1rem);
}
.animation_btn a:hover {
    background-color: #1c1a18;
}
.animation_btn a:hover svg {
    visibility: visible;
    transform: translateX(0px);
    opacity: 1;
}
.animation_btn a:hover span {
    transform: translateX(0);
}
.animation_btn a.main_btn {
    margin: 0;
    min-height: auto;
    font-size: inherit;
    font-size: 12px;
    font-weight: 500;
}

/** animation_btn style end **/
/** title style start **/
.block_title {
    text-align: center;
    padding-bottom: 20px !important;
    margin: 0;
}
.block_title h2 {
    font-size: var(--title_font_size);
    color: var(--title_color);
    font-family: var(--title_font_family);
    font-style: var(--title_font_style);
    font-weight: var(--title_font_weigth);
    letter-spacing: var(--title_letter_spacing);
    line-height: 1;
    margin-bottom: 28px;
}
@media screen and (max-width: 767px) {
    .block_title h2 {
        font-size: calc(var(--title_font_size) * var(--wap_title_scale));
    }
}
.block_title .block_title-detail {
    color: var(--detail_color);
    max-width: 880px;
    margin: 0 auto;
    line-height: 1.7;
    margin-top: 20px;
}
@media screen and (max-width: 767px) {
    .block_title .block_title-detail {
        margin-top: 10px;
    }
}
.block_title.notCenter {
    text-align: var(--text-algin);
}
.block_title.notCenter .block_title-detail {
    margin: 0;
    max-width: 100%;
}

/** title style end **/
/** collection_product style start **/
.product_card {
    position: relative;
    width: 100%;
    box-sizing: border-box;
    overflow: hidden;
}
.product_card .product_price {
    font-weight: bold;
}
.product_card .product_card-tag {
    position: absolute;
    right: 0;
    top: 0;
    z-index: 10;
    color: var(--discount_tag_color);
}
.product_card .product_card-tag .discount_tag_graphics {
    position: absolute;
    right: 0;
}
.product_card .label_style_1 {
    width: 80px;
    height: 80px;
    line-height: 80px;
}
.product_card .label_style_1 .discount_tag_graphics {
    top: 0;
    width: 0;
    height: 0;
    border-top: 80px solid var(--discount_tag_bg);
    border-left: 80px solid transparent;
}
.product_card .label_style_1 .discount_tag_name {
    position: relative;
    top: 6px;
    left: 15px;
    z-index: 9;
    line-height: 18px;
    transform: rotate(45deg);
    width: 80px;
    height: 40px;
    font-size: 14px;
    text-align: center;
}
.product_card .label_style_1 span {
    display: block;
}
.product_card .label_style_2 {
    padding: 0 0 10px;
}
.product_card .label_style_2 .discount_tag_graphics {
    left: 0;
    bottom: 0;
    width: 40px;
    height: 10px;
}
.product_card .label_style_2 .discount_tag_graphics:before {
    position: absolute;
    right: 0;
    top: 0;
    content: "";
    width: 0;
    height: 0;
    border-top: 10px solid var(--discount_tag_bg);
    border-left: 20px solid transparent;
}
.product_card .label_style_2 .discount_tag_graphics:after {
    position: absolute;
    left: 0;
    top: 0;
    content: "";
    width: 0;
    height: 0;
    border-top: 10px solid var(--discount_tag_bg);
    border-right: 20px solid transparent;
}
.product_card .label_style_2 .discount_tag_name {
    width: 40px;
    text-align: center;
    background: var(--discount_tag_bg);
    padding: 10px 0;
}
.product_card .label_style_3 {
    height: 80px;
    width: 80px;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
}
.product_card .label_style_3 .discount_tag_name {
    position: relative;
    top: -10px;
    left: 10px;
    z-index: 9;
    line-height: 24px;
    transform: rotate(45deg);
    height: 24px;
    white-space: nowrap;
    background: var(--discount_tag_bg);
    padding: 0px 25px;
}
.product_card .label_style_4 {
    right: 10px;
    top: 10px;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: var(--discount_tag_bg);
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
}
.product_card .label_style_4 .discount_tag_name {
    line-height: 18px;
    text-align: center;
}
.product_card .label_style_4 .discount_tag_name span {
    display: block;
}
.product_card:hover .product_card-picture-image img {
    transform: scale(1.1);
}
.product_card:hover .product_card-name a {
    transform: translateY(-100%);
}
.product_card:hover .product_card-name a:nth-last-child(1) {
    transform: translateY(0);
}
.product_card .product_card-name {
    text-align: center;
    margin-top: 30px;
    overflow: hidden;
    position: relative;
}
@media screen and (max-width: 767px) {
    .product_card .product_card-name {
        margin-top: 15px;
    }
}
.product_card .product_card-name a {
    color: var(--title_color);
    width: 100%;
    transition: all 0.2s;
}
.product_card .product_card-name a.inblock {
    display: inline-block;
}
.product_card .product_card-name a:nth-last-child(1) {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    transform: translateY(100%);
    transition: all 0.2s;
}
@media screen and (max-width: 767px) {
    .product_card .product_card-wap-name {
        display: none;
    }
}
.product_card .product_card-price {
    text-align: center;
    margin-top: 10px;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

.product_card-picture {
    position: relative;
}
.product_card-picture .product_card-picture-image {
    display: block;
    position: relative;
    overflow: hidden;
    position: relative;
}
.product_card-picture .product_card-picture-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.2s;
}
.product_card-picture .product_card-picture-image .product_card-picture-hover {
    display: none;
}
.product_card-picture .product_card-soldout {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 30px;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    line-height: 50px;
    background: rgba(0, 0, 0, 0.3);
    color: #fff;
    font-size: 14px;
}
.product_card-picture .product_card-picture-crop-11 {
    padding-top: 100%;
}
.product_card-picture .product_card-picture-crop-11 img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.product_card-picture .product_card-picture-crop-34 {
    padding-top: 125%;
}
.product_card-picture .product_card-picture-crop-34 img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.product_card-picture .product_card-picture-crop-23 {
    padding-top: 150%;
}
.product_card-picture .product_card-picture-crop-23 img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.product_card-picture .product_card-picture-crop-12 {
    padding-top: 200%;
}
.product_card-picture .product_card-picture-crop-12 img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.product_card-picture:hover .product_quick-mask {
    display: flex;
}
.product_card-picture .product_quick-mask {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    z-index: 10;
    display: none;
}
@media screen and (max-width: 767px) {
    .product_card-picture .product_quick-mask {
        display: none !important;
    }
}
.product_card-picture .product_quick-mask .product_quick-view {
    display: inline-block;
    color: #fff;
    width: 100%;
    background-color: #cbb8c1cc;
    text-align: center;
    margin-bottom: 0;
    font-size: 14px;
    padding: 15px 0;
}

.product_img_hover:hover .product_card-picture-default {
    display: none;
}

.product_img_hover:hover .product_card-picture-hover {
    display: block;
}

/** collection_product style end **/
/** waterfall_product style start **/
/** waterfall_product style end **/
/** footer_yd_svg style start **/
/** footer_yd_svg style end **/

.product_quick-mobile-view {
    position: absolute;
    top: 10px;
    left: 10px;
    background-color: var(--main_button_bg);
    display: none;
    border-radius: 50%;
    flex-direction: column;
    align-items: center;
    padding: 8px;
}

.product_quick-mobile-view path {
    fill: var(--main_button_color);
}

@media screen and (max-width: 767px) {
    .product_quick-mobile-view {
        display: flex;
    }
}
